<style>

    .h-nav ul li .h-navlast {
        margin-left: 235px;
    }
    .f-upload-select-container{
        width:100%;
        background: #F9F8F7;
        padding-top:50px;
        padding-bottom:50px;
    }
    .f-upload-select-box-up{.
    margin:0 auto;
        width:1200px;
        /*height:400px;*/
        background: #fff;
        /*margin-bottom:20px;*/
        border: 1px solid #DEDEDE;
        /*border-bottom:0px solid #DEDEDE;*/
    }
    .f-upload-fill-info{
        margin:0 auto;
        width:1200px;
        height:30px;
        /*margin-bottom:20px;*/
        border: 1px solid #DEDEDE;
        border-top:0px solid #DEDEDE;
    }
    .f-upload-select-des-container{
        margin:0 auto;
        padding-left:20px;
        padding-bottom:30px;
        width:1180px;
        height:650px;
        background: #fff;
        border: 1px solid #DEDEDE;
    }
    .f-upload-select-step{
        width: 530px;
        height: 85px;
        margin: 0 auto;
        padding-top: 50px;
    }
    .f-step-box{
        float:left;
        width:50px;
    }
    .f-step-number-blue{
        width:30px;
        height:30px;
        border-radius: 15px;
        background:#00A4FF;
    }
    .f-step-number-gray{
        width:30px;
        height:30px;
        border-radius: 15px;
        background:#EBF2E9;
    }
    .f-step-number-blue a ,.f-step-number-gray a{
        display: block;
        text-align: center;
        font-size: 16px;
        color: #fff;
        font-weight: bold;
        line-height: 30px;
    }
    .f-upload-select-cutting-line{
        margin:14px 10px 0 -10px;
        float: left;
        background: #EBF2E9;
        width: 180px;
        height: 4px;
    }
    .f-step-number-des{
        width:50px;
        text-align: center;
        display: block;
        margin-left: -10px;
    }
    /*选择文件区域*/
    .f-upload-select-des{
        margin:0 auto;
        height:200px;
        width:700px;
        border: 1px dashed #DEDEDE;
    }
    .f-upload-select-button{
        margin-top:50px;
    }
    .f-upload-select-file-button{
        margin:0 auto;
        width:240px;
        height:60px;
        background: #00A4FF;
    }
    .f-upload-select-file-des{
        margin:0 auto;
        width:240px;
        height:40px;
    }
    .f-upload-select-file-des a{
        display: block;
        line-height: 40px;
        text-align: center;
    }
    .f-upload-select-file-button a{
        display: block;
        text-align: center;
        font-size: 22px;
        color: #fff;
        line-height: 60px;
    }
    /**/
    .f-upload-interduce{
        font-size: 12px;
        margin-top:30px;
    }
    .f-upload-interduce h3{
        line-height: 25px;
    }
    .f-upload-interduce p{
        line-height: 24px;
    }
    .uploadTypeTitleDes2 a{
        display: block;
        float:left;
        cursor: default;
    }
    .uploadTypeDes2{
        display: block;
        width:286px;
        height:23px;
        background:url("them/images/uploadFileType.png") no-repeat;
    }
    /*fillInfo*/
    .f-upload-fill-info p{
        float:left;
        font-size: 16px;
        line-height: 30px;
    }
    .addMore{
        float:right;
        display: block;
        width:104px;
        height:32px;
        border-radius: 2px;
        border:1px solid #DEDEDE;
        background:url("them/images/addMore.png")no-repeat;
    }
    .f-upload-file-info-box{
        margin:0 auto;
        width:1190px;
        /*height:20px;*/
        padding:25px 10px 20px 0px;
        background:#fff;
        border: 1px solid #DEDEDE;
        border-top:0px solid #DEDEDE;
    }
    .f-upload-file-info-num{
        float:left;
        width:100px;
    }
    .f-upload-file-info-num a{
        display: block;
        width:30px;
        height:20px;
        background: url("them/images/addFileNumPic.png")no-repeat;
    }
    .f-upload-file-info-num-45{
        float:left;
        width:45px;
        height: 100%;
    }
    .f-upload-file-info-num-45 a{
        display: block;
        width: 30px;
        padding-left: 7px;
        line-height: 20px;
        height: 20px;
        color: #fff;
        background: url(them/images/addFileNumPic.png)no-repeat;
    }
    .f-upload-file-info-title{
        float:left;
        width:50px;
        line-height: 20px;
    }
    .f-upload-file-info-content{
        float:left;
        width:320px;
    }
    .f-upload-file-info-up{
        margin-top:-5px;
    }
    .f-upload-file-info-up img{
        float:left;
        margin-right:5px;
    }
    .f-upload-file-info-up p{
        float:left;
    }
    .f-upload-file-info-bottom{
        margin-top:5px;
    }
    .f-upload-file-info-bottom img{
        float:left;
        margin-top:3px;
        margin-right:5px;
    }
    .f-upload-file-info-bottom p{
        float:left;
    }
    .f-upload-file-info-right{
        width:150px;
        float:right;
    }
    .f-upload-file-info-edit,.f-upload-file-info-delete{
        text-align: center;
        width:75px;
        float:left;
        color: #666460;
    }
    .f-upload-file-info-edit img,.f-upload-file-info-delete img,.f-upload-file-info-edit p,.f-upload-file-info-delete p {
        float:left;
    }
    .f-upload-file-info-edit img, .f-upload-file-info-delete img{
        margin-top:3px;
        margin-left:3px;
        cursor: pointer;
    }
    .f-upload-fill-info-container-bottom{
        height:205px;
        color: #666460;
    }
    .f-upload-fill-cd-file-title{
        height:45px;
    }
    .f-upload-fill-cd-file-title .f-upload-fill-cd-file-title-content{
        float:left;
        margin-right:20px;
    }
    .f-upload-fill-cd-file-title .input-container{
        float:left;
    }
    .f-upload-fill-cd-file-title .input-des{
        margin-top:10px;
    }
    .f-upload-fill-info-container-top{
        height:30px;
    }
    .f-upload-fill-cd-file-content{
        height:100px;
        margin-top:15px;
        margin-bottom: 10px;
    }
    .f-upload-fill-cd-file-content  .f-upload-fill-cd-file-title-content{
        float:left;
        margin-right: 20px;
    }
    .f-upload-fill-cd-file-content  .input-container{
        float:left;
    }
    .input-container textarea{
        width:250px;
        height:81px;
    }

    /*下载所需*/
    .f-upload-fill-cd-file-dwn-need  .f-upload-fill-cd-file-title-content, .f-upload-fill-cd-file-dwn-need  .input-container{
        float:left;
    }
    .f-upload-fill-cd-file-dwn-need  .f-upload-fill-cd-file-title-content{
        margin-right: 20px;
    }
    .f-upload-fill-cd-file-dwn-need  .input-container{
        margin-right: 10px;
        margin-top:-10px;
    }
    .input-container .input-title{
        width:245px;
        height:20px;
    }
    .margin-left-20{
        margin-left:20px;
    }

    .dwnNeed{
        width:20px;
        height:20px;
    }
    /*f-upload-fill-info-cb-r*/
    .f-upload-fill-info-cb-l ,.f-upload-fill-info-cb-r{
        float:left;
        margin-right:50px;
    }
    .f-upload-okbtn{
        margin:0 auto;
        width:1200px;
        height:70px;
        padding-top:30px;
    }
    .f-upload-okbtn a{
        display: block;
        margin:0 auto;
        width:106px;
        height:34px;
        background: url("them/images/upload_btn.png")no-repeat;
    }
    .f-upload-file-ok{
        background-color: #fff;
        width:1200px;
        margin:0 auto;
        padding-top: 50px;
        padding-bottom: 50px;
        border: 1px solid #ddd;
        border-top:0px solid #ddd;
    }
    .f-upload-file-ok p{
        margin: 0 auto;
        height:30px;
        text-align: center;
    }
    .f-upload-file-ok  .congratulation{
        display: block;
        margin: 0 auto;
        height:30px;
        width: 250px;
        line-height: 24px;
        font-size: 24px;
        color: #000;
        padding-left:35px;
        background:url("them/images/success_icon.png")no-repeat;
    }
    .f-upload-file-ok  .notice{
        font-size:14px;
        color:#9A9690;
        line-height: 30px;
    }
    /*上传成功后 两个btn 样式设定*/
    .f-upload-file-btn-box{
        margin: 0 auto;
        height:35px
    margin-top:35px;
    }
    .f-upload-file-btn-box .f-upload-btn-box-container{
        margin:0 auto;
        width: 280px;
    }
    .f-upload-btn-box-container a{
        float:left;
        width: 120px;
        height: 34px;
        margin-right:20px;
    }
    .checkMyCollect{
        background: url("them/images/check_upload.png")no-repeat;
    }
    .uploadContinue{
        background: url("them/images/upload_continue.png")no-repeat;
    }



    /*自定义select 复选框 样式*/
    .multiselect {
        /*width: 200px;*/
    }
    .selectBox {
        position: relative;
    }
    .selectBox select {
        width: 100%;
    }
    .overSelect {
        position: absolute;
        left: 0; right: 0; top: 0; bottom: 0;
    }
    #checkboxes {
        display: none;
        border: 1px #dadada solid;
    }
    #checkboxes label {
        display: block;
    }
    #checkboxes label:hover {
        background-color: #1e90ff;
    }
    #progressBar{
        background: #30a3ff;
        text-align: center;
        height:30px;
        line-height: 30px;
    }
</style>


<div class="f-upload-select-container">
    <div class="f-upload-select-box-up" style="margin:0 auto">
        <div class="f-upload-select-step clearfix">
            <div class="f-step-box">
                <div class="f-step-number-blue" >
                    <a>1</a>
                </div>
                <a class="f-step-number-des"   style="color:#30a3fe"  ng-bind="i18n.selectFile"></a>
            </div>
            <div class="f-upload-select-cutting-line"></div>
            <div class="f-step-box">
                <div class="f-step-number-blue">
                    <a>2</a>
                </div>
                <a class="f-step-number-des"  style="color:#30a3fe"   ng-bind="i18n.uploadFile" ></a>

            </div>
            <div class="f-upload-select-cutting-line"></div>
            <div class="f-step-box">
                <!-- ng-class="{true:'f-engMain-title-a-check-lr',false:'f-engMain-title-a-nocheck'}[isCheckA.intern]" -->
                <div class="f-step-number-gray" ng-class="{true:'f-step-number-gray',false:'f-step-number-blue'}[showFillInfo]">
                    <a>3</a>
                </div>
                <a class="f-step-number-des"  ng-class="{true:'color30a3fe',false:''}[!showFillInfo]" ng-bind="i18n.uploadSuccess"></a>
            </div>
        </div>
    </div>
    <!-- 显示上传文件  步骤 进程  下部   ，分成两种显示  1 提交信息 2 上传完成提示信息333-->
    <div ng-show="showFillInfo">
        <div class="f-upload-fill-info clearfix" id="ossfile">
        </div>
        <form name="uploadForm">
        <div class="f-upload-file-info-box clearfix">
            <div class="f-upload-file-list clearfix">
                <div class="f-upload-file-list-item clearfix">
                    <a class="f-upload-file-list-lable"><span class="input-required" >*</span>资料标题:</a>
                    <input class="f-upload-file-list-input"  name="dataTitle"  maxlength="200" ng-model="uploadInfo.name" type="text" placeholder="请输入资料标题"/>
                    <div class="validat-message-box clearfix"><p  ng-show="uploadForm.dataTitle.$invalid && !uploadForm.dataTitle.$pristine">最大长度为200</p></div>
                </div>
                <div class="f-upload-file-list-item">
                    <a class="f-upload-file-list-lable"><span class="input-required" >*</span>关键词:</a>
                    <input class="f-upload-file-list-input" ng-change="controlLength($parent.tagsWork)" ng-model="$parent.tagsWork" type="text" placeholder="关键词之间以空格隔开,最多6个关键词"/>
                    <b class="addBtn" ng-click="saveTagsname($parent.tagsWork)">添加</b>
					<ul class="checkFI3Con">
	                	<li ng-repeat="item in tags2 track by $index">
	                		<a href="javascript:;" ng-bind="item"></a>
	                		<b ng-click="deleteInput($index)" class="close"></b>
	                	</li>
	                </ul>
                </div>
            </div>
            <div class="f-upload-file-list clearfix">
                <div class="f-upload-file-list-item clearfix">
                    <a class="f-upload-file-list-lable">下载所需:</a>

                    <input class="f-upload-file-list-input" type="number" min="0"  ng-model="uploadInfo.price"  style="width: 36px;" type="text" />

                    <a style="height: 30px; line-height: 30px;margin-left: 10px;">积分</a>
                </div>
            </div>
            <div class="f-upload-file-list clearfix">
                <div class="f-upload-file-list-item clearfix" style="float:left ;width: 100%;">
                    <a class="f-upload-file-list-lable"><span class="input-required" >*</span>资料分类:</a>
                    <div class="f-upload-fill-cd-file-title clearfix" style="margin-top:12px">
                        <!--<p class="f-upload-fill-cd-file-title-content" ng-bind="i18n.fileClassify"></p>-->

                        <div class="iask-please">
                            <div>请选择</div>
                            <ul ng-repeat="item in engClassify">
                                <li ng-click="changeTcOptions(item,$index)" ng-style="isCheckForTc[$index]">{{item.tcName}}</li>
                            </ul>
                        </div>
                        <div ng-if="isShowSec" style="float:left">
                            <div class="iask-pleaseed" >
                                <ul>
                                    <li ng-repeat="item in secCate" ng-click="changeScOptions(item,$index)" ng-style="isCheckForSc[$index]">{{item.scName}}</li>
                                </ul>
                            </div>
                            <div class="iask-three" ng-if="isShowNationDec" >
                                <ul>
                                    <li ng-repeat="item in curDetail" ng-click="changeDcOptions(item,$index)" ng-style="isCheckForDc[$index]">{{item.dcName}}</li>
                                </ul>
                            </div>
                        </div>
                        <div class="iask-them"  ng-if="isShowInterDec">
                            <ul>
                                <li ng-repeat="item in secCate">
                                    <div class="dandan" ng-click="changeScOptions(item,$index)">{{item.scName}}</div>
                                    <div class="showbox" ng-if="showInterDecCate[$index]">
                                        <h2>{{major1}}：</h2>
                                        <div> <label ng-repeat="item in curDetail |getContentMajor  "><span>{{item.dcName}}</span><input type="radio" name="radio1" value={{item.dcId}} ng-model="interDcIds.major"></label></div>
                                        <h2>{{major2}}：</h2>
                                        <div><label ng-repeat="item in curDetail |getInterContent"><span>{{item.dcName}}</span><input type="radio" name="radio2" value={{item.dcId}} ng-model="interDcIds.content"></label></div>
                                        <h2>{{major3}}：</h2>
                                        <div><label ng-repeat="item in curDetail |getInterParten"><span>{{item.dcName}}</span><input type="radio" name="radio3" value={{item.dcId}} ng-model="interDcIds.projectPattern"></label></div>
                                        <h2 ng-if="uploadInfo.scId == 17">{{major4}}：</h2>
                                        <div ng-if="uploadInfo.scId == 17"><label ng-repeat="item in curDetail |getInterNew"><span>{{item.dcName}}</span><input type="radio" name="radio4" value={{item.dcId}} ng-model="interDcIds.manage"></label></div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <div class="f-upload-file-list clearfix">
                <div class="f-upload-file-list-item clearfix" style="float:left ;width: 100%;">
                    <a class="f-upload-file-list-lable">内容介绍:</a>
                    <textarea class="f-upload-file-list-input"  ng-model="uploadInfo.introduction"  style="width: 950px;height: 100px;resize: none;" type="text" ></textarea>
                </div>
            </div>

        </div>
        <div class="f-upload-okbtn">
            <a class="btn"  ng-click="addFile()"></a>
        </div>
        </form>
    </div>
    <div ng-hide="showFillInfo">
        <div class="f-upload-file-ok">
            <p>
                <a class="congratulation" ng-bind="i18n.uploadResourceSuccess"></a>
            </p>
            <p class="notice">您已成功上传1个文件，审核通过后，将获得{{coinValue}}积分</p>
            <div class="f-upload-file-btn-box">
                <div class="f-upload-btn-box-container clearfix">
                    <a class="checkMyCollect"   ng-click="goTo('prosonMine.myUpload')"></a>
                    <a class="uploadContinue" ng-click="goTo('eng.uploadSelectFile')"></a>
                </div>
            </div>
        </div>
    </div>
</div>
<style>
.addBtn{
	display: inline-block;
    width:60px;
    height:30px;
    background: #30a3ff;
    text-align: center;
    line-height:30px;
    color: #fff;
    font-weight:normal;
    cursor: pointer;
    margin-left: 10px;
}
.checkFI3 span {
    float: left;
}
.checkFI3Con{
	margin: 3px 0 0 100px;
}
.checkFI3Con li{
	float: left;
	position: relative;
	margin-left: 20px;
    margin-bottom: 10px;
}
.checkFI3Con li a {
	display: block;
	border: 1px solid #e1f2fa;
	text-align: center;
	line-height: 28px;
	padding-left: 16px;
	padding-right: 16px;
	height: 28px;
	background: #edf9ff;
	color: #30a3ff;
}
.checkFI3Con li b{
	position: absolute;
	width: 12px;
	height: 12px;
	top: 0;
	right: 5%;
	display: block;
	background: url(them/imgs/ngInput.jpg) no-repeat;
	cursor: pointer;
}
.first3 span{
    width:86px;
    height:30px;
    display: inline-block;
    text-align: right;
    margin-right:27px;
}
.first3 span i {
    color: #ff0000;
}
    /*
    修改上传
    */
    .color30a3fe{
        color:#30a3fe;
    }
    .f-upload-file-list{
        width: 100%;
        padding-left: 40px;
        padding-right: 20px;
    }
    .f-upload-file-list-item {
        float:left;
        width: 50%;
        margin-top: 30px;
        cursor: default;
    }
    .f-upload-file-list-item .f-upload-file-list-lable .input-required{
        font-weight: 900;
        color: #f00;
    }
    .f-upload-file-list-item .f-upload-file-list-lable , .f-upload-file-list-item .f-upload-file-list-input{
        float:left ;
        height: 30px;
        line-height: 30px;
    }
    .f-upload-file-list-item .f-upload-file-list-lable{
        width:100px;
        margin-right: 20px;
    }
    .f-upload-file-list-item .f-upload-file-list-input{
        width:340px;
        padding-left: 10px;
    }



    input ,textarea {
        border:  1px solid #ddd;
    }
    .iask-please{
        float: left;
        border: 1px solid #ddd;
    }
    .iask-pleaseed{
        float: left;
        width: 160px;
        height: 196px;
        border: 1px #ddd solid;
        margin-left: 15px;
        overflow-x: auto;
    }
    /*点击国际工程出来的盒子*/
    .showbox{
        /*float: left;*/
        width:100%;
        background-color:#f7f7f7;
    }
    .iask-them h2{
        display:inline-block;
        /*float: left;*/
        /*width:100%;*/
        font-size:12px;
        color:#30a3ff;
        background-color:#f7f7f7;
        padding-left:6px;
    }
    .iask-them span{
        display:inline-block;
        clear: both;
    }
    .iask-them input{
        /*opacity: 0;*/
    }
    .iask-them label{
        clear: both;
        margin-left:6px;
        background-color:#f7f7f7;
    }
    .iask-them{
        float: left;
        width: 530px;
        height:196px;
        border:1px #ddd solid;
        overflow: auto;
        margin-left:15px;
    }
    .iask-them>ul>li>.dandan{
        /*float: left;*/
        height:40px;
        color:#666;
        background-color:#fff;
        font-size:12px;
        line-height:40px;
        cursor: pointer;
        padding-left:6px;
    }
    .iask-them>ul>li>.dandan:hover{
        color:#fff;
        background-color:#30a3ff;
    }
    /*三级分类盒子*/
    .iask-three{
        float:left;
        width:190px;
        height:196px;
        border: 1px #ddd solid;
        margin-left:15px;
        overflow:auto;
    }
    .iask-three>ul>li{
        display: inline-block;
        float: left;
        width:160px;
        height:24px;
        line-height:24px;
        font-size:12px;
        color:#666;
        cursor: pointer;
        margin:0;
        padding:0;
        padding-left:6px;
    }
    .iask-three>ul>li:hover{
        color:#fff;
        background-color:#30a3ff;
    }
    /**/
    .iask-pleaseed>ul>li{
        display: inline-block;
        float: left;
        width:130px;
        height:24px;
        line-height:24px;
        font-size:12px;
        color:#666;
        cursor: pointer;
        margin:0;
        padding:0;
        padding-left:6px;
    }
    .iask-pleaseed>ul>li:hover{
        color:#fff;
        background-color:#30a3ff;
    }
    /**/
    .iask-please>ul>li{
        display: inline-block;
        float: left;
        width:86px;
        height:24px;
        line-height:24px;
        font-size:12px;
        color:#666;
        cursor: pointer;
        margin-top:0;
        padding:0;
        padding-left:6px;
    }
    .iask-please>ul>li:hover{
        color:#fff;
        background-color:#30a3ff;
    }
    .iask-please div{
        width:86px;
        height:28px;
        border-bottom:1px #ddd solid;
        font-size:12px;
        color:#333;
        background:url("them/img/iasktopbottom.png") 72px 10px no-repeat;
        background-size:14px 8px;
        line-height:28px;
        padding-left:6px;
    }
</style>
